

import advListView from "$v/advList"

import { isLoginRequest } from "../api/admin"
import { addAdvRequest, advListRequest, deleteAdvListRequest, getUpdateDataRequest, updateAdvRequest } from "../api/adv"

//封装一个获取所以广告列表函数
const getAllAdvList = async (pageNO = 1, everyNO = 3) => {
  try {
    return await advListRequest(pageNO, everyNO)
  } catch (e) {
    alert("查询广告异常" + e.message)
  }
}

export default async (req, res, next) => {

  //路由切换的时候验证登录
  try {
    await isLoginRequest()
  } catch (e) {
    alert("有异常:" + e.message)

    //判断是否是权限异常
    if (!e.isLogin) {
      //权限校验失败返回登录页面 通过比对捕捉e.isLogin.code 的数值20000
      return router.go("/login")
    }
  }

  //调用获取广告列表函数
  const { advList, pageCount } = await getAllAdvList()
  //真正广告的列表??
  // console.log(advList);

  //添加广告逻辑
  res.render(advListView({ advList, pageCount }))

  //绑定绑定事件给docoment 因为以后还要重新渲染
  document.onclick = async function (e) {

    if (e.target.id === "adv-save") {

      //收集表单数据 通过forData form这是表单数据 通过get 获取具体值 by name
      const form = new FormData(document.advForm)
      //获取表单具体值
      // console.log(form.get("advTitle"));
      // console.log( form.get("advType"));
      // console.log(form.get("advOrder"));
      // console.log(form.get("advPic"));
      //要确定表单不为空 
      //如果为空 则为faulse  ！XX 为真 即不为 空 正确的 执行
      if (!form.get("advTitle") || !form.get("advType") || !form.get("advOrder") || !form.get("advPic")) {
        return alert("表单内容不能为空")
      }
      //发送请求 发送请求异步  await async 发送请求可能出错 try 
      try {
        await addAdvRequest(form)
        alert("添加广告成功");

        //因为添加广告成功之后还有自动关闭弹窗,所以
        document.getElementById("addClose").click();
        //还要清空表单里面的内容
        document.advForm.reset();
      } catch (e) {

        alert("添加广告异常" + e.message);
        //出错则将图片隐藏
        const preImg = document.getElementById("preImg")
        preImg.style.display = "none"

        //判断是否是权限异常
        if (!e.isLogin) {
          //权限校验失败返回登录页面 通过比对捕捉e.isLogin.code 的数值20000
          //有bug 退回登录界面有一层蒙版 原因 没有点击关闭按钮就跳转 解决 跳转前 执行点击关闭按钮
          document.getElementById("addClose").click();
          return router.go("/login")
        }
      }
      //并且添加广告还有重新渲染页面
      // res.render(advListView())
      // res.render(advListView({ advList }))

  


    }


    //删除广告前端逻辑
    //获取到删除按钮
    if (e.target.classList.contains("btn-delete")) {

      const _id = e.target.dataset.id;
      // console.log("id hh", _id);
      try {
        await deleteAdvListRequest(_id)
        alert("删除成功")
        //调用获取adv列表的函数
        const advList = await getAllAdvList()
        console.log("advListcc",advList);
        //根据数据渲染
        res.render(advListView(advList))
      } catch (e) {
        console.log(e.message);
        alert("删除失败" + e.message)

        //判断是否是权限异常
        if (!e.isLogin) {
          //关闭添加广告的弹窗再跳转
          document.getElementById("addClose").click();
          return router.go("/login");
        }
      }


    }


    // 更新按钮前获取数据的逻辑
    if (e.target.classList.contains("btn-update")) {

      const _id = e.target.dataset.id;
      try {
        const updateData = await getUpdateDataRequest(_id)
        // console.log(updateData);
        //把对应数据库id对应的列表信息放在前台窗口中
        document.updateForm.advTitle.value = updateData.advTitle
        document.updateForm.advType.value = updateData.advType
        document.updateForm.advOrder.value = updateData.advOrder
        // document.updateForm.addTime.value =updateData.addTime

        //给当前更新按钮内的更新按钮添加一个_id 方便以后提交
        document.getElementById("adv-update").dataset.id = updateData._id
      } catch (e) {
        alert("更新查询失败" + e.message)
      }
    }

    //更新广告逻辑
    // if(e.target.classList.contains("adv-update")){
    //   console.log(11);
    // }
    if (e.target.id === "adv-update") {
      //更新内更新的按钮
      //数据库中要更新数据特有的标识
      const _id = e.target.dataset.id
      //更新的表单
      const form = new FormData(document.updateForm)
      console.log(form.get("advTitle"));
      console.log(form.get("advType"));
      console.log(form.get("advOrder"));
      console.log(form.get("advPic"));

      if (!form.get("advTitle") || !form.get("advType") || !form.get("advOrder") || !form.get("advPic")) {
        return alert("表单内容不能为空")
      }
      try {
        const re = await updateAdvRequest(form, _id)
        //  console.log( form.get("advTitle"));
        alert("更新成功")
        //重新渲染视图
        //调用获取adv列表的函数
        const advList = await getAllAdvList()
        // console.log(advList);
        //根据数据渲染
        // res.render(advListView({
        //   advList
        // }))
        // //关闭窗口
        // document.getElementById("addClose").click();
        document.querySelector(".modal-backdrop").style.display = "none"

      } catch (e) {
        alert("更新失败" + e.message)
      }
    }


    //页码点击的逻辑
    // if (e.target.nodeName === "SPAN" && e.target.parentNode.id === "page") {

      
    //   const pageNO = +e.target.dataset.pageno;
    //   console.log(pageNO);
    //   //重新发请求
    //   const { advList, pageCount } = await getAllAdvList(pageNO)

    //   console.log(111);
    //   console.log(advList,"advli??");
    //   // 根据数据渲染
    //   res.reader(advListView(
    //     {advList}
    //   ))

    // }



  }
  //图片预览需求
  document.onchange = function (e) {
    if (e.target.id === "advPic") {
      const reader = new FileReader()
      reader.readAsDataURL(e.target.files[0])
      reader.onload = function (e) {
        //预览图片
        const preImg = document.getElementById("preImg")
        preImg.src = e.target.result
        preImg.style.display = "block"
      }
    }
  }
}